import { useLocation, useNavigate, useParams, useSearchParams } from 'react-router-dom'
// 封装高阶组件
function withRouter(WrapperComponent) {
  return function(props) {

    // 1. 导航
    const navigate = useNavigate()

    // 2. 动态路由 /detail/:id
    const params = useParams()

    // 3. 查询字符串 /user?name=aaa&age=18
    const location = useLocation()
    const [searchParams] = useSearchParams()
    // searchParams格式为URLSearchParams,将其转化成普通对象
    const query = Object.fromEntries(searchParams)

    const router = { navigate, params, location, query }
    return <WrapperComponent { ...props } router={router}></WrapperComponent>
  }
 }

 export default withRouter